<template>
	<div class="container">
		<view class="menu" @click="handleNavTo(it.path)" v-for='it in list' :key="it.title">
			<text class="name">
				{{it.title}}
			</text>
			<view class="r">
				<image :src="it.img" mode="widthFix"></image>
			</view>
		</view>

	</div>

</template>

<script>
	export default {
		data() {
			return {
				list: [{
					img: '/static/images/form-gz.png',
					title: '故障上报',
					path:''
				},{
					img: '/static/images/form-task.png',
					title: '新增巡检任务',
					path:'/pages/plan/planAdd/planAdd'
				},{
					img: '/static/images/form-ly.png',
					title: '留言意见',
					path:'/pages/leaveWord/leaveWordForm/leaveWordForm'
				},{
					img: '/static/images/form-yy.png',
					title: '语音墙',
					path:'/pages/voiceWall/voiceWallIndex/voiceWallIndex'
				},{
					img: '/static/images/form-alarm.png',
					title: '一键报警',
					path:'/pages/alarmPage/alarmFrom/alarmFrom'
				},]
			}

		},
		methods:{ 
			handleNavTo(path){
				if(path){
					uni.navigateTo({
						url:path
					})
				}
			}
		}
	}
</script>

<style lang="scss">
.container{
	background-color: $uni-color-bg;
	min-height: 100vh;
	padding: 22upx 30upx;
	box-sizing: border-box;
	.menu{
		display: flex;
		align-items: center;
		background-color: #fff;
		border-radius: 12upx;
		padding: 22upx 30upx;
		box-sizing: border-box;
		margin-bottom: 22upx;
		justify-content: space-between;
		.r{

			box-sizing: border-box;
			width: 160upx;
			height: 160upx;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 50%;
			background-color: $uni-color-bg;
			image{
				width: 100upx;
				height: 100upx;
			}
		}
	}
}
</style>
